<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:a4j="http://richfaces.org/a4j">

	<rich:modalPanel id="editRulesPanel" minWidth="650" minHeight="510" resizeable="false">
		<f:facet name="header">
			<h:outputText value="#{spatialRulesHelper.adding ? messages['spatial_rules.new_rule'] : messages['spatial_rules.edit_rule']}"/>
		</f:facet>
		
		<f:facet name="controls">
			<h:panelGroup>
				<h:graphicImage value="/img/close.png" styleClass="hidelink"
					id="hideEditRulesPanel" />
				<rich:componentControl for="editRulesPanel" attachTo="hideEditRulesPanel"
					operation="hide" event="onclick" />
			</h:panelGroup>
		</f:facet>
		
		<h:form>
			<a4j:jsFunction
				name="selectLandUse1"
				action="#{selectLandUseHelper.setInputFields('frmEditRule:idLandUse1', 'frmEditRule:nameLandUse1')}"
				reRender="frmSelectLandUse"
				oncomplete="#{rich:component('selectLandUsePanel')}.show()">
				<f:setPropertyActionListener target="#{selectLandUseHelper.landUseField}" value="spatialRulesHelper.selected.landUseOperand1" />
			</a4j:jsFunction>
			<a4j:jsFunction
				name="selectLandUse2"
				action="#{selectLandUseHelper.setInputFields('frmEditRule:idLandUse2', 'frmEditRule:nameLandUse2')}"
				reRender="frmSelectLandUse"
				oncomplete="#{rich:component('selectLandUsePanel')}.show()">
				<f:setPropertyActionListener target="#{selectLandUseHelper.landUseField}" value="spatialRulesHelper.selected.landUseOperand2" />
			</a4j:jsFunction>
		</h:form>
		
		<h:form id="frmEditRule">
			<h:panelGroup rendered="#{spatialRulesHelper.selected != null}">
			<div style="width:100%;height:475px;overflow:auto">
				<div align="center">
					<strong>#{messages['spatial_rules.CODE_DESCRIPTION']}</strong>
					<br />
					<rich:separator lineType="solid"/>
					<br />
					<h:panelGrid columns="2" style="width:95%">
						<h:outputText value="#{messages['spatial_rules.code']}" />
						<h:inputText value="#{spatialRulesHelper.selected.code}" style="width:30%" rows="2" />

						<h:outputText value="#{messages['spatial_rules.description']}" />
						<h:inputText value="#{spatialRulesHelper.selected.description}" style="width:100%" rows="2" />
					</h:panelGrid>
				</div>
				
				<br />
				<table style="width:100%;" cellpadding="5">
					<tr valign="top">
						<th style="width:40%;">
							<div align="center">
								#{messages['spatial_rules.OPERAND']} 1
							</div>
							<rich:separator lineType="solid"/>
						</th>
						<th style="width:20%;">
							<div align="center">
								#{messages['spatial_rules.rule_operator']}
							</div>
							<rich:separator lineType="solid"/>
						</th>
						<th style="width:40%;">
							<div align="center">
								#{messages['spatial_rules.OPERAND']} 2
							</div>
							<rich:separator lineType="solid"/>
						</th>
					</tr>
					<tr valign="top">
						<td>
							<table style="width:100%;">
								<tr>
									<th style="width:20%;text-align: left;">#{messages['spatial_rules.level']}</th>
									<td>
										<h:selectOneMenu value="#{spatialRulesHelper.selected.levelOperand1}" converter="#{spatialRulesHelper.levelConverter}" style="width:100%">
											<f:selectItems value="#{spatialRulesHelper.levelList}"/>
										</h:selectOneMenu>
									</td>
								</tr>
								<tr>
									<th style="width:20%;text-align: left;">#{messages['spatial_rules.use']}</th>
									<td>
										<h:inputTextarea id="nameLandUse1" value="#{spatialRulesHelper.landUseName1}" rows="1" style="width:100%" readonly="true" ondblclick="selectLandUse1();" />
										<br />
										<h:outputText value="#{messages['msg.double_click_change_use']}" style="color:Red;" />
									</td>
								</tr>
							</table>
						</td>
						<td>
							<h:selectOneMenu value="#{spatialRulesHelper.selected.ruleOperator}" style="width:100%">
								<f:selectItems value="#{spatialRulesHelper.ruleOperatorValueList}"/>
							</h:selectOneMenu>
						</td>
						<td>
							<table style="width:100%;">
								<tr>
									<th style="width:20%;text-align: left;">#{messages['spatial_rules.level']}</th>
									<td>
										<h:selectOneMenu value="#{spatialRulesHelper.selected.levelOperand2}" converter="#{spatialRulesHelper.levelConverter}" style="width:100%">
											<f:selectItems value="#{spatialRulesHelper.levelList}"/>
										</h:selectOneMenu>
									</td>
								</tr>
								<tr>
									<th style="width:20%;text-align: left;">#{messages['spatial_rules.use']}</th>
									<td>
										<h:inputTextarea id="nameLandUse2" value="#{spatialRulesHelper.landUseName2}" rows="1" style="width:100%" readonly="true" ondblclick="selectLandUse2();" />
										<br />
										<h:outputText value="#{messages['msg.double_click_change_use']}" style="color:Red;" />
									</td>
								</tr>
							</table>
						</td>
					</tr>
				</table>
				
				<br />
				
				<div align="center">
					<strong>#{messages['spatial_rules.DISTANCE_COMPARISON_OPERATOR']}</strong>
					<rich:separator lineType="solid"/>
					<br />
					<table style="width:60%;">
						<tr valign="bottom">
							<th style="width:50%;text-align:left;">
								#{messages['spatial_rules.distance_comparison_operator']}
							</th>
							<td>
								<h:selectOneMenu value="#{spatialRulesHelper.selected.comparisonOperator}" style="width:100%">
									<f:selectItems value="#{spatialRulesHelper.comparisonOperatorValueList}"/>
								</h:selectOneMenu>
							</td>
						</tr>
						<tr valign="top">
							<th style="width:50%;text-align:left;">
								#{messages['spatial_rules.distance_distance']}
							</th>
							<td>
								<h:inputText value="#{spatialRulesHelper.selected.comparisonParameterValue}" style="width:100%" />
							</td>
						</tr>
					</table>
					<br />
					<br />
					<strong>#{messages['spatial_rules.ACTION']}</strong>
					<rich:separator lineType="solid"/>
					<br />
					<table>
						<tr>
							<th>#{messages['spatial_rules.action']}</th>
							<td>
								<h:selectOneMenu value="#{spatialRulesHelper.selected.action}" style="width:100%">
									<f:selectItems value="#{spatialRulesHelper.ruleActionValueList}"/>
								</h:selectOneMenu>
							</td>
						</tr>
					</table>
					
					<br />
					<rich:messages></rich:messages>
					<br />
					
					<a4j:commandButton
						value="#{messages['button.ok']}"
						action="#{spatialRulesHelper.applyChanges}"
						reRender="dtSpatialRules"
						oncomplete="if (#{facesContext.maximumSeverity == null}) #{rich:component('editRulesPanel')}.hide();">
					</a4j:commandButton>
					#{'  '}
					<a4j:commandButton value="#{messages['button.cancel']}" ajaxSingle="true" oncomplete="#{rich:component('editRulesPanel')}.hide();" />
					<br />
				</div>
			</div>
			</h:panelGroup>
		</h:form>
	</rich:modalPanel>
	
	<ui:include src="/WEB-INF/includes/selectLandUse.xhtml" />
	

</ui:composition>
